<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ include file="/jsp/common/common.jsp"%>

<!doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<link rel="stylesheet" type="text/css"
	href="<c:url value="/static/jquery-easyui/themes/default/easyui.css"/>">
<link rel="stylesheet" type="text/css"
	href="<c:url value="/static/jquery-easyui/themes/icon.css"/>">
<link rel="Stylesheet" type="text/css"
	href="<c:url value="/static/css/jquery.ui.css"/>" />
<script type="text/javascript"
	src="<c:url value="/static/jquery-easyui/jquery-1.6.min.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/jquery-easyui/jquery.easyui.min.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/jquery-easyui/plugins/jquery.panel.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/jquery-easyui/plugins/jquery.datagrid.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/jquery-easyui/plugins/jquery.messager.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/jquery-easyui/ext-for-framework.js.jsp"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/jquery-easyui/locale/easyui-lang-zh_CN.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/js/common.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/js/Loading.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/js/showMsg.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/static/listBox/jquery.clever.listbox.js"/>"></script>
<script type="text/javascript"
    src="<c:url value="/jsp/matermanage/materUnit/addMaterUnit.js"/>"></script>
<script>
	var dataLeft;
	function initList(listDisplayEId,materId) {
		$('#' + listDisplayEId).datagrid(
				{
					url:"<c:url value='/materUnit/lookMaterUnit.do'/>"+"?hostMaterId="+materId,
					nowrap : false,
					striped : true,
					collapsible : true,
					remoteSort : true,
					notSelectByRow : false,
					onLoadError : function() {
						$.messager.alert('错误', '获取数据失败，请与管理员联系！', 'error');
					},
					toolbar : [
							{
								id : listDisplayEId + '_btn_add',
								text : '新增',
								iconCls : 'icon-add',
								handler : function() {
									addMaterAuxiliaryUnit();
								}
							},
							'-',
							{
								text : '撤销',
								iconCls : 'icon-undo',
								handler : function() {
									$('#' + listDisplayEId).datagrid(
											'rejectChanges');
									addId = 0;
								}
							} ]

				});
	};
	$(document).ready(function() {
		initList('listDisplay','0');
		document.getElementById('zzy').style.display = 'none';
	    document.getElementById('zzy2').style.display = 'none';
	    document.getElementById("materId").value = 0;


		$("#materString").textbox({
			buttonText : '查询',
			iconCls : 'icon-man',
			iconAlign : 'left',
			editable : false,
			value : "无",
			width : '300px',
			onClickButton : function() {
				
				showMsgLeft();
				ShowDiv();

				var left = $('#left').listbox();
				var items = left.getDatas();
				left.removeRange(items);

				var right = $('#right').listbox();
				var itemsr = right.getDatas();
				right.removeRange(itemsr);
			}
		});
	});

	function ShowDiv() {
		var Allwidth = '100%';
		var Allheight = '100%';
		document.getElementById('zzy').style.display = '';
		Loading.Show({
			width : Allwidth,
			height : Allheight
		});
	}

	//初始化showMsg
	function showMsgLeft() {
		$('#left').listbox({
			data : dataLeft,
			height : 300,
			width : 500,
			dndscope : 'demo',
			dnd : false,
			multiselect : true,
			selectchange : function(data) {
				if (data && data.length > 0) {
					$('#btnRight').attr('disabled', false);
				} else {
					$('#btnRight').attr('disabled', true);
				}
			}
		});
		var data = [ {
			value : 10,
			text : 'think8848'
		}, {
			value : 20,
			text : 'aCloud'
		}, {
			value : 21,
			text : 'aaaaa'
		}, {
			value : 36,
			text : 'qqqqq'
		} ];
		$('#right').listbox({
			//data: data,
			height : 300,
			width : 500,
			dndscope : 'demo',
			dnd : true,
			multiselect : true
		});
		$('#btnRightAll').click(function() {
			var left = $('#left').listbox();
			var items = left.getDatas();
			left.clear();
			$('#right').listbox().addRange(items);
		});
		$('#btnLeftAll').click(function() {
			var right = $('#right').listbox();
			var items = right.getDatas();
			right.clear();
			$('#left').listbox().addRange(items);
		});
		$('#btnRight').click(function() {
			var left = $('#left').listbox();
			var items = left.getSelected();
			left.removeRange(items);
			$('#right').listbox().addRange(items);
		});
		$('#btnLeft').click(function() {
			var right = $('#right').listbox();
			var items = right.getSelected();
			right.removeRange(items);
			$('#left').listbox().addRange(items);
		});
		$('#btnRemove').click(function() {
			$('#right').listbox().removeRange([ {
				value : 2
			}, {
				value : 26
			} ]);
		});
		$('#btnSelect').click(function() {
			var selected = $('#right').listbox().getSelected();
			var msg = 'Selected count is: ' + selected.length;
			if (selected.length > 0) {
				msg += ', The first item text is: ' + selected[0].text;
			}
			msg += '.';
			alert(msg);
		});
		$('#btnGetItems').click(function() {
			var selected = $('#right').listbox('getDatas');
			alert('Items count is: ' + selected.length);
		});
		$('#btnSetSelection').click(function() {
			$('#left').listbox('setSelection', 1);
		});
		$('#select').click(function() {
			Loading.Hide();
			document.getElementById('zzy').style.display = 'none';

			var right = $('#right').listbox();
			var items = right.getDatas();
			var userList = new Array();

			var userNames = '';
			var userIds = '';

			if (items.length > 1) {
				alert("只能选取一个！");
				return;
			}
			for ( var e in items) {
				userNames = userNames + items[e].text;
				userIds = userIds + items[e].value;
			}
			if (userNames != '' && userIds != '') {
				$('#materString').textbox('setValue', userNames);
				document.getElementById('materId').value = userIds;
				initList('listDisplay',userIds);
			} else {
				$('#materString').textbox('setValue', '无');
				document.getElementById('materId').value = 0;
			}

		});
		$('#noselect').click(function() {
			Loading.Hide();
			document.getElementById('zzy').style.display = 'none';
		});
	}
	//添加信息按钮响应函数
	var xhrDeal;

	function deal() {

		if (document.getElementById("materId").value == 0) {
			$.messager.alert("提示", "请填写主单位材料！", 'info');
			return;
		}
	    
		var rows = $('#listDisplay').datagrid('getRows');
		var materIdAll ='' ;//校验种类唯一的数组
		if(rows.length ==0){
			alert("附属材料不能为空！");
			return ;
		}
		for (var i = 0; i < rows.length; i++) {
			materIdAll= materIdAll +rows[i]['materId']+',';
		}
		materIdAll = materIdAll.substring(0, materIdAll.length-1)
		//提前存入ajax from
		var form = new FormData();
		
		//ajax 提交表单数据
		form.append("materIdAll", materIdAll); // 可以增加表单数据
		form.append("materId", document.getElementById("materId").value); // 可以增加表单数据

		// XMLHttpRequest 对象
		xhrDeal = new XMLHttpRequest();
		xhrDeal.onreadystatechange = deal_retuen;
		xhrDeal.open("post", '<c:url value='/materUnit/addMaterUnit.do'/>', true);
		xhrDeal.send(form);
	}

	function deal_retuen() {
        if (xhrDeal.readyState == 4) {// 4 = "loaded"

            if (xhrDeal.status == 200) {// 200 = OK
                var data;
                data = xhrDeal.responseText;
                if (typeof (data) == 'string' && data != '') {
                    data = JSON.parse(data);
                }
                if(data.success){
                	alert("处理成功！");
                	window.opener.window.tea();
                    window.close();
                }else{
                	alert(data.msg);
                }
            } else {
                alert("Problem retrieving XML data");
            }
        }
    }
	var xhr;
	var xhr2;
	function searchInfoForShowCust() {

		var materId = document.getElementById("materIdForSearch").value;
		if (materId == '') {
			materId = 0;
		}

		var form = new FormData();
		form.append("materId", materId); // 可以增加表单数据
		form.append("materName", document.getElementById("materName").value); // 可以增加表单数据
		xhr = new XMLHttpRequest();
		xhr.onreadystatechange = state_Change;
		// xhr.setRequestHeader("Accept", "text/plain")
		xhr.open(
						"post",
						'<c:url value='/supplierDistribute/checkSupplierDistributeForGather.do'/>',
						true);
		xhr.send(form);
	}
	function state_Change() {
		if (xhr.readyState == 4) {// 4 = "loaded"

			if (xhr.status == 200) {// 200 = OK
				var data;
				data = xhr.responseText;
				if (typeof (data) == 'string' && data != '') {
					data = JSON.parse(data);
				}
				var a = data.stringJson;
				if (typeof (dataLeft) == 'string' && dataLeft != '') {
					a = JSON.parse(dataLeft);
				}
				$('#left').listbox().reload({
					data : a,
					ajaxsettings : {
						data : {
							id : 'a'
						}
					}
				});
			} else {
				alert("Problem retrieving XML data");
			}
		}
	}
	
	//附属材料查询模块
    function searchInfoForShowCust2() {

        var materId = document.getElementById("materIdForSearch2").value;
        if (materId == '') {
            materId = 0;
        }

        var form = new FormData();
        form.append("materId", materId); // 可以增加表单数据
        form.append("materName", document.getElementById("materName2").value); // 可以增加表单数据
        xhr2 = new XMLHttpRequest();
        xhr2.onreadystatechange = state_ChangeT;
        // xhr.setRequestHeader("Accept", "text/plain")
        xhr2
                .open(
                        "post",
                        '<c:url value='/supplierDistribute/checkSupplierDistributeForGather.do'/>',
                        true);
        xhr2.send(form);
    }
    function state_ChangeT() {
        if (xhr2.readyState == 4) {// 4 = "loaded"

            if (xhr2.status == 200) {// 200 = OK
                var data;
                data = xhr2.responseText;
                if (typeof (data) == 'string' && data != '') {
                    data = JSON.parse(data);
                }
                var a = data.stringJson;
                if (typeof (dataLeft) == 'string' && dataLeft != '') {
                    a = JSON.parse(dataLeft);
                }
                $('#left2').listbox().reload({
                    data : a,
                    ajaxsettings : {
                        data : {
                            id : 'a'
                        }
                    }
                });
            } else {
                alert("Problem retrieving XML data");
            }
        }
    }
 // 初始化showMsg
    function showMsgLeft2() {
        $('#left2').listbox({
            data : dataLeft,
            height : 300,
            width : 500,
            dndscope : 'demo',
            dnd : false,
            multiselect : true,
            selectchange : function(data) {
                if (data && data.length > 0) {
                    $('#btnRight').attr('disabled', false);
                } else {
                    $('#btnRight').attr('disabled', true);
                }
            }
        });
        var data = [ {
            value : 10,
            text : 'think8848'
        }, {
            value : 20,
            text : 'aCloud'
        }, {
            value : 21,
            text : 'aaaaa'
        }, {
            value : 36,
            text : 'qqqqq'
        } ];
        $('#right2').listbox({
            // data: data,
            height : 300,
            width : 500,
            dndscope : 'demo',
            dnd : true,
            multiselect : true
        });
        $('#btnRightAll2').click(function() {
            var left = $('#left2').listbox();
            var items = left.getDatas();
            left.clear();
            $('#right2').listbox().addRange(items);
        });
        $('#btnLeftAll2').click(function() {
            var right = $('#right2').listbox();
            var items = right.getDatas();
            right.clear();
            $('#left2').listbox().addRange(items);
        });
        $('#btnRight2').click(function() {
            var left = $('#left2').listbox();
            var items = left.getSelected();
            left.removeRange(items);
            $('#right2').listbox().addRange(items);
        });
        $('#btnLeft2').click(function() {
            var right = $('#right2').listbox();
            var items = right.getSelected();
            right.removeRange(items);
            $('#left2').listbox().addRange(items);
        });
        $('#btnRemove2').click(function() {
            $('#right2').listbox().removeRange([ {
                value : 2
            }, {
                value : 26
            } ]);
        });
        $('#btnSelect2').click(function() {
            var selected = $('#right2').listbox().getSelected();
            var msg = 'Selected count is: ' + selected.length;
            if (selected.length > 0) {
                msg += ', The first item text is: ' + selected[0].text;
            }
            msg += '.';
            alert(msg);
        });
        $('#btnGetItems2').click(function() {
            var selected = $('#right2').listbox('getDatas');
            alert('Items count is: ' + selected.length);
        });
        $('#btnSetSelection2').click(function() {
            $('#left2').listbox('setSelection', 1);
        });
        $('#select2').click(function() {
            Loading.Hide();
            document.getElementById('zzy2').style.display = 'none';

            var right = $('#right2').listbox();
            var items = right.getDatas();

            if (items.length > 0) {
                for ( var e in items) {
                    var dateone = '{"materId":"'+ items[e].value+'"}';
                    var dataOneJson =JSON.parse(dateone);
                    $.ajax({
                        async : true,
                        url : "<c:url value='/mater/getMaterPo.do'/>",
                        type : "post",
                        dataType: "json",
                        data: $.param(dataOneJson),
                        success : function(data) {
                            if(typeof(data)=='string'){
                                dataJson =JSON.parse(data);
                            }else{
                                dataJson = data;
                            }
                            if(dataJson.success){
                                //检索后插入
                                $('#listDisplay').datagrid('appendRow', {
                                    materId   : dataJson.materPo.materId,
                                    materName : dataJson.materPo.materName,
                                    materType : dataJson.materPo.materType,
                                    unit      : dataJson.materPo.unit,
                                    brands    : dataJson.materPo.brands,
                                    specifications : dataJson.materPo.specifications
                                });
                            }else{
                                $.messager.alert('提示','购物车已有此种商品，请在购物车中修改数量！','info');
                            }
                        }
                    });
                    
                }
            }
            
            var itemsr = right.getDatas();
            right.removeRange(itemsr);

        });
        $('#noselect2').click(function() {
            Loading.Hide();
            document.getElementById('zzy2').style.display = 'none';
        });
    }
</script>
</head>

<body>
	<table width="90%" align="center">
		<tr></tr>
		<tr>
			<td>

				<div style="height: auto; background: #fafafa; padding: 5px;"
					class="easyui-panel" title="添加材料单位关联信息" iconCls="icon-save"
					collapsible="true" minimizable="false" maximizable="false"
					closable="false">

					<form id="AddFoodForm" name="AddFoodForm" method="post"
						enctype="multipart/form-data" action="userlist.txt"
						onsubmit="return searchDGData(this.id,'listDisplay');">
						<table cellpadding="5">

							<tr>
								<td>主材料
								<td>
								<td><input class="easyui-textbox" name="materString"
									id="materString" /></td>
								<td><input class="easyui-validatebox" type="hidden"
									name="materId" id="materId" value="0" /></td>
								<td><input class="easyui-validatebox" type="hidden"
                                    name="materIdAll" id="materIdAll" value="0" /></td>
							</tr>

						</table>
						<table cellpadding="5" width="90%">
							<tr>
								<td>
									<table id="listDisplay" title="材料列表" iconCls="icon-list"
										singleSelect="true" idField="materId"
										loadMsg="请稍候......" pagination="false" rownumbers="true">
										<thead>
											<tr>
                                                <th field="materRole" width="25" align="center"
                                                    checkbox="true"></th>
                                                <th field="materId" width="50" sortable="true">材料ID</th>
                                                <th field="materName" width="140" sortable="true">材料名</th>
                                                <th field="materType" width="80" formatter="formatFoodType1"
                                                    sortable="true" editor="text">种类</th>
                                                <th field="unit" width="50" sortable="true" editor="text">单位</th>
                                                <th field="brands" width="70" sortable="true" editor="text">品牌</th>
                                                <th field="specifications" width="70" sortable="true"
                                                    editor="text">规格</th>
                                            </tr>
										</thead>
									</table>
								</td>
							</tr>
						</table>
						<a class="easyui-linkbutton" onclick="deal()">添加</a>
					</form>
				</div>
			</td>
		</tr>
	</table>
	<div
		style='position: absolute; left: 40px; top: 40px; z-index: 101; background-color: #FFFFFF; border-radius: 10px; width: 1200px;'
		id="zzy">
		<table align="center">
			<tr>
				<td colspan="3">
					<form id="searchFormForShowCust" name="searchFormForShowCust"
						method="post" accept-charset="UTF-8">
						<div
							style="height: auto; width: 400; background: #fafafa; padding: 5px;"
							class="easyui-panel" title="查询" iconCls="icon-search"
							collapsible="true" minimizable="false" maximizable="false"
							closable="false">
							<table>
								<tr>
									<td>材料id:</td>
									<td><input class="easyui-validatebox" name="materIdForSearch"
										id="materIdForSearch" /></td>
									<td>材料名称:</td>
									<td><input class="easyui-validatebox" name="materName"
										id="materName" /></td>
									<td><a href="#" class="easyui-linkbutton"
										data-options="iconCls:'icon-search'" style="width: 60px"
										onclick="searchInfoForShowCust()">查询</a></td>
									<td><input type="hidden" name="materdategridList"
										id="materdategridList" /></td>

								</tr>
							</table>
						</div>
					</form>
				</td>
			</tr>
			<tr>
				<td>
					<ul id="left">
					</ul>
				</td>
				<td><input type="button" value="&gt;&gt;" id="btnRightAll"
					style="width: 50px;" /><br /> <input type="button" value="&gt;"
					id="btnRight" style="width: 50px;" /><br /> <input type="button"
					value="&lt;" id="btnLeft" style="width: 50px;" /><br /> <input
					type="button" value="&lt;&lt;" id="btnLeftAll" style="width: 50px;" />
				</td>
				<td>
					<ul id="right">
					</ul>
				</td>
			</tr>
		</table>
		<table align="center">
			<tr>
				<!--  
                <td><input type="button" value="Add Item" id="btnAdd" /></td>
                <td><input type="button" value="Remove Item" id="btnRemove" /></td>
                <td><input type="button" value="Get Select" id="btnSelect" /></td>
                <td><input type="button" value="Get Items" id="btnGetItems" /></td>
                <td><input type="button" value="SetSelection (value equal to '1')" id="btnSetSelection" /></td>
                <td><input type="button" value="Reload" id="btnReload" /></td>
                -->
				<td><input type="button" value="取消" id="noselect" /></td>
				<td width="200px"></td>
				<td><input type="button" value="选择" id="select" /></td>

			</tr>
		</table>
	</div>
	
	<div
        style='position: absolute; left: 40px; top: 40px; z-index: 101; background-color: #FFFFFF; border-radius: 10px; width: 1200px;'
        id="zzy2">
        <table align="center">
            <tr>
                <td colspan="3">
                    <form id="searchFormForShowCust" name="searchFormForShowCust"
                        method="post" accept-charset="UTF-8">
                        <div
                            style="height: auto; width: 400; background: #fafafa; padding: 5px;"
                            class="easyui-panel" title="查询" iconCls="icon-search"
                            collapsible="true" minimizable="false" maximizable="false"
                            closable="false">
                            <table>
                                <tr>
                                    <td>材料id:</td>
                                    <td><input class="easyui-validatebox" name="materIdForSearch2"
                                        id="materIdForSearch2" /></td>
                                    <td>材料名称:</td>
                                    <td><input class="easyui-validatebox" name="materName2"
                                        id="materName2" /></td>
                                    <td><a href="#" class="easyui-linkbutton"
                                        data-options="iconCls:'icon-search'" style="width: 60px"
                                        onclick="searchInfoForShowCust2()">查询</a></td>
                                    <td><input type="hidden" name="materdategridList"
                                        id="materdategridList" /></td>

                                </tr>
                            </table>
                        </div>
                    </form>
                </td>
            </tr>
            <tr>
                <td>
                    <ul id="left2">
                    </ul>
                </td>
                <td><input type="button" value="&gt;&gt;" id="btnRightAll2"style="width: 50px;" /><br />
                    <input type="button" value="&gt;" id="btnRight2" style="width: 50px;" /><br /> 
                    <input type="button" value="&lt;" id="btnLeft2" style="width: 50px;" /><br /> 
                    <input type="button" value="&lt;&lt;" id="btnLeftAll2" style="width: 50px;" />
                </td>
                <td>
                    <ul id="right2">
                    </ul>
                </td>
            </tr>
        </table>
        <table align="center">
            <tr>
                <!--  
                <td><input type="button" value="Add Item" id="btnAdd" /></td>
                <td><input type="button" value="Remove Item" id="btnRemove" /></td>
                <td><input type="button" value="Get Select" id="btnSelect" /></td>
                <td><input type="button" value="Get Items" id="btnGetItems" /></td>
                <td><input type="button" value="SetSelection (value equal to '1')" id="btnSetSelection" /></td>
                <td><input type="button" value="Reload" id="btnReload" /></td>
                -->
                <td><input type="button" value="取消" id="noselect2" /></td>
                <td width="200px"></td>
                <td><input type="button" value="选择" id="select2" /></td>

            </tr>
        </table>
    </div>
</body>
</html>